<template>
    <div class="flex column " >
        <div class="content flex-item" >
            <div v-for="(item, idx) in dataList" :key="idx" class="image-card" >
                <image-card :data="item" />
            </div>
        </div>
        
    </div>
</template>
<script>
import { mapGetters, mapMutations, mapActions } from 'vuex'
import imageCard from '@/components/image-card'
// mzitu   https://www.mzitu.com
// aimeimei   https://www.lovemmtu.net/
export default {
  data () {
    return {
      dataList: [],
      URL: 'https://www.lovemmtu.net/',
      NEXTURL: null
    }
  },
  computed: {
    ...mapGetters({
      systemInfo: 'home/systemInfo'
    })
  },
  onShareAppMessage () {

  },
  onReachBottom () {
    // 到达底部
    console.log('到达底部')

    const { URL, NEXTURL } = this
    if (URL !== NEXTURL) {
      this.URL = NEXTURL
      this.getData()
    }
  },
  components: {
    imageCard
  },
  onShow () {
    this.getData()
    console.log(this.systemInfo)
  },
  methods: {
    ...mapMutations(['updateText']),
    ...mapActions({
      getMeizituIndex: 'home/getMeizituIndex',
      getAiMMTUList: 'home/getAiMMTUList'
    }),
    onClick () {
      wx.navigateTo({
        url: '/home/index'
      })
    },
    editText () {
      this.updateText('修改了')
    },
    getData () {
      wx.showLoading()
      // meizitu
      //   this.getMeizituIndex(this.URL).then(res => {
      //     console.log(res)
      //     this.URL = res.next
      //     this.dataList = this.dataList.concat(res.items)
      //   })
      this.getAiMMTUList(this.URL).then(res => {
        console.log(res)
        wx.hideLoading()
        this.NEXTURL = res.next
        this.dataList = this.dataList.concat(res.items)
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.content {
    padding: 0.1rem 0.3rem 0.2rem ;
    .image-card {
        width: 3.3rem;
        // height: 4.4rem;
        display: inline-block;
    }
    .image-card:nth-child(odd) {
        margin-right: 0.3rem;
    }
    .image-card + .image-card {
        margin-top: 0.2rem;
    }
}
</style>


